const isProduction = process.env.NODE_ENV === 'production';
const {defineConfig} = require('@vue/cli-service')
const CompressionPlugin = require('compression-webpack-plugin')
const path = require('path')
const resolve = dir => path.join(__dirname, dir)
let externals = {}
let cdn = {css: [], js: []};
if (isProduction) {
	externals = {
		vue: 'Vue',
		'vue-router': 'VueRouter',
		vuex: 'Vuex',
		echarts: 'echarts',
	}
	cdn = {
		css: ['https://api.yolailehealth.com/npm/element-plus@2.2.32/dist/index.min.css'],
		js: [
			'https://api.yolailehealth.com/npm/vue@3.2.47/dist/vue.global.prod.js',
			'https://api.yolailehealth.com/npm/vue-router@4.1.6/dist/vue-router.global.prod.js',
			'https://api.yolailehealth.com/npm/vuex@4.1.0/dist/vuex.global.prod.js',
			'https://api.yolailehealth.com/npm/echarts@5.4.1/dist/echarts.min.js'
		]
	}
}
module.exports = defineConfig({
	//设置为空打包后不分更目录还是多级目录
	publicPath: '',
	//build编译后存放静态文件的目录
	//assetsDir: "static",

	// build编译后不生成资源MAP文件
	productionSourceMap: false,

	//transpileDependencies: true,
	parallel: true,
	//开发服务,build后的生产模式还需nginx代理
	devServer: {
		allowedHosts: 'all',
		open: false, //运行后自动打开浏览器
		port: process.env.VUE_APP_PORT, //挂载端口
		proxy: {
			'/api': {
				target: process.env.VUE_APP_API_BASEURL,
				changeOrigin: true,
				pathRewrite: {
					'^/api': ''
				}
			},
		},
		client: {
			overlay: {
				runtimeErrors: false,
			},
		}
	},

	chainWebpack: config => {
		config.output.filename('[name].[contenthash].js').end();
		// 移除 prefetch 插件
		config.plugins.delete('preload');
		config.plugins.delete('prefetch');
		config.resolve.alias.set('vue-i18n', 'vue-i18n/dist/vue-i18n.cjs.js');
		config.module.rule('js')
			.use('thread-loader')
			.loader('thread-loader')
			.end();
		// 添加别名
		config.resolve.alias
			.set('@', resolve('src'))
			.set('assets', resolve('src/assets'))
			.set('api', resolve('src/api'))
			.set('views', resolve('src/views'))
			.set('components', resolve('src/components'));
		config.plugin('html').tap(args => {
			if (isProduction) {
				args[0].cdn = cdn
			} else {
				args[0].cdn = cdn
			}
			return args
		})
	},
	configureWebpack: {
		//性能提示
		performance: {
			hints: false
		},
		externals: externals,
		plugins: [
			new CompressionPlugin({
				algorithm: 'gzip', // 使用gzip压缩
				test: /\.js$|\.html$|\.css$/, // 匹配文件名
				filename: '[path][base].gz', // 压缩后的文件名(保持原文件名，后缀加.gz)
				minRatio: 1, // 压缩率小于1才会压缩
				threshold: 10240, // 对超过10k的数据压缩
				deleteOriginalAssets: false, // 是否删除未压缩的源文件，谨慎设置，如果希望提供非gzip的资源，可不设置或者设置为false（比如删除打包后的gz后还可以加载到原始资源文件）
			}),
		],
		optimization: {
			splitChunks: {
				chunks: "all",
				automaticNameDelimiter: '~',
				name: "scuiChunks",
				cacheGroups: {
					//第三方库抽离
					vendor: {
						name: "modules",
						test: /[\\/]node_modules[\\/]/,
						priority: -10,
						reuseExistingChunk: true,
					},
					elicons: {
						name: "elicons",
						test: /[\\/]node_modules[\\/]@element-plus[\\/]icons-vue[\\/]/
					},
					tinymce: {
						name: "tinymce",
						test: /[\\/]node_modules[\\/]tinymce[\\/]/
					},
					echarts: {
						name: "echarts",
						test: /[\\/]node_modules[\\/]echarts[\\/]/
					},
					xgplayer: {
						name: "xgplayer",
						test: /[\\/]node_modules[\\/]xgplayer.*[\\/]/
					},
					codemirror: {
						name: "codemirror",
						test: /[\\/]node_modules[\\/]codemirror[\\/]/
					}
				}
			}
		}
		// resolve: {extensions: [".ts", ".tsx", ".js", ".json"]},
		// module: {
		// 	rules: [
		// 		{
		// 			test: /\.tsx?$/,
		// 			loader: 'ts-loader',
		// 			exclude: /node_modules/,
		// 			options: {
		// 				appendTsSuffixTo: [/\.vue$/],
		// 			}
		// 		}
		// 	]
		// }
	}
})
